<template>
	<div>
		<div class="head">
			<a @click="$router.back(-1)" class="return"></a>
			AIDT充币
		</div>
		<div class="overlay">
			<div class="overlay-content scrolling"  >  
				<div v-if="show">
					<div align="center">
						<img :src="imgUrl" style="width:38%;margin-top: 20px;" alt="">
					</div>
					<div>
						<div id="copyText" v-text="inviteCode" style="color: transparent;background-color: transparent;position: absolute;z-index: 0;-webkit-user-select: text;word-wrap: break-word;width: 80%;"></div>
					</div>
					<div align="left" style="color: #8690AB;">
						<!-- <div style="width:135px; margin:10px auto;"><van-checkbox v-model="checked" checked-color="#07c160">自动划到币币账户</van-checkbox></div> -->
						
						<div class="site" style="padding-top:20px;">
							<span>
								<p v-text="inviteCode" style="word-wrap:break-word;padding: 0px 10px;"></p>
							</span>
						</div>
					</div>
					<div class="btn">
						<van-button slot="button" size="normal" type="info" @click.native="copyLink">复制</van-button>
					</div>
					<div class="hint">
						<div class="tit">温馨提示</div>
						<p>请勿向上述地址充值任何非 AIDT(REC20) 资产，否则资产将不可找回。</p>
						<p>请务必确认电脑及浏览器安全，防止信息被篡改或泄露。</p>
					</div>
				</div>

				<div v-if="!show" style="text-align: center;color: #888888;padding-top: 40%;font-size: 15px;" align="center">
					<img src="../assets/images/addressError.png" style="width: 40%;height: 40%;padding-left: 10%;"/>
					<div style="padding-top: 20px; color:#fff;">地址生成失败，请查看网络是否连接...</div>
				</div>
			</div>
			
		</div>
	</div>
</template>

<script>
	let _this;
	export default {
		name: 'Invite',
		data() {
			return {
				imgUrl: '',
				inviteCode: '',
				msg: '',
				show: true,
				checked:false,
				k: '', // 凭证K值
				v: '', // 凭证V值
			}
		},
		beforeCreate() {
			_this = this;
		},
		created() {
			
		},
		mounted() {
			this.getSharing();
		},
		methods: {
			getSharing() {
				this.axios.get(process.env.API_HOST + 'user/transfer/into/' + 1).then(res => {
					// const url = process.env.API_HOST + 'user/transfer/into/'
					// this.axios.get(url,{
					// 	params:{
					// 		coinId:0
					// 	}
					// }
					// )
					// .then(res => {
					if(res.data.code == 200) {
						this.show = true;
						this.inviteCode = res.data.data.address;
						this.imgUrl = res.data.data.qrContent;
						this.checked = res.data.data.autoCutIn;
					}else if(res.data.code == 500){
						this.show = false;
						this.msg = res.data.msg;
					}
				})
			},
			copyLink() { //复制邀请链接
				let sUserAgent = navigator.userAgent.toLowerCase();
				let bIsIpad = sUserAgent.match(/ipad/i) == "ipad";
				let bIsIphoneOs = sUserAgent.match(/iphone os/i) == "iphone os";
				window.getSelection().removeAllRanges();
				if(bIsIpad || bIsIphoneOs) {
					var copyDOM = document.querySelector('#copyText'); //要复制文字的节点
					var range = document.createRange();
					// 选中需要复制的节点
					range.selectNode(copyDOM);
					// 执行选中元素
					window.getSelection().addRange(range);
					// 执行 copy 操作
					var successful = document.execCommand('copy');
					try {
						var msg = successful ? 'successful' : 'unsuccessful';
						_this.$vux.toast.text('复制成功', 'middle');
					} catch(err) {
						_this.$vux.toast.text('复制失败', 'middle');
					}
					// 移除选中的元素
					window.getSelection().removeAllRanges();
				} else {
					const Url2 = document.getElementById("copyText").innerText;
					const oInput = document.createElement('input');
					oInput.value = Url2;
					document.body.appendChild(oInput);
					oInput.select(); // 选择对象
					document.execCommand("Copy"); // 执行浏览器复制命令
					oInput.className = 'oInput';
					oInput.style.display = 'none';
					_this.$vux.toast.text('复制成功', 'middle');
				}
			}
		}
	}
</script>

<style lang="less" scoped>
.btn /deep/ .van-button{background:#525fd6!important;border:1px solid #525fd6!important}
	.head~.overlay {
		top: 45px;
	}
	
	.head .return:after {
		border-color: #FFFFFF;
	}
	
	.btn {
		padding: 30px 20px;
	}
	.hint{
		.tit{
			font-size: 14px;
			padding-bottom:10px;
		}
		p{
			font-size: 12px;
			color:#9a9fb1;
		}
	}
	.site{
		text-align: center;
		color:#9a9fb1;
	}
	/deep/.van-checkbox__label{
		color:#fff !important;
		font-size: 12px;
	}
	/deep/.van-checkbox__icon .van-icon{
		width: 20px;
		height: 20px;
		font-size: 14px;
	}
</style>